import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Link } from 'react-router';
import {  Modal,Icon,Card,message,Button,Table ,Row,Col} from 'antd';
import api from '../../api';
import {INVEST_STATUS,ACCOUNT_CHANGE_TYPE} from '../../constants/index';

export default class FundsRecord extends React.Component {
    constructor(props, context){
        super(props, context);
        this.state={
            page:1,
            total:1,
            list:[],
            loading:true
        };
    }

    componentWillMount(){
      let {page} = this.state;
      let {id,tabType,curType} = this.props;
      if(tabType==curType&&id){
        this.doFetch(page)
      }
    }
    componentWillReceiveProps(nextProps){
      let {page} = this.state;
      let {id,tabType,curType} = nextProps;
      this.setState({loading:true})
      if(tabType==curType&&id){
        this.doFetch(page)
      }
    }

    //查询资金流水
   async doFetch(page=1){
      let {id} = this.props;
      let result = await api('/user/funds/record',{id,page});
      if(result.cd!=0){
        message.error(result.msg);
        return
      }
      this.setState({
        loading:false,
        page,
        list:result.data,
        total:result.total||1
      })
   }

    //翻页
   pageTo = ({current:page,total,pageSize}) => {
    this.setState({loading:true});
    this.doFetch(page);
   }

   //手工确认
   async fundsConfirm(id){
      let result = await api('/user/funds/confirm',{id})
      if(result.cd != 0){
        message.error(result.msg);
        return
      }
      message.success('操作成功');
      let {page} = this.state;
      this.doFetch(page);
   }
   

   
    render() {
      let {
          page,
          total,
          list,
          loading
      } = this.state;
      return (
        <div >
          <Table 
            bordered
            columns={this.getColumns()} 
            simple 
            dataSource={list}
            pagination={{
              current:page,
              total,
              pageSize:10,
              showQuickJumper : true
            }}
            loading={loading}
            onChange={this.pageTo}
            scroll={{ x: 1000 }}
            rowKey={record => record.changeId}
          />
        </div>
      );
    }

    getColumns(){

      let columns = [
            {
              title: '资金流水ID',
              dataIndex: 'changeId',
              key: 'changeId',
            }, {
              title: '操作类型',
              dataIndex: 'changeType',
              key: 'changeType',
              render:(changeType)=>{
                return ACCOUNT_CHANGE_TYPE[changeType];
              }
              
            }, {
              title: '操作金额',
              dataIndex: 'changeAmount',
              key: 'changeAmount'
            },{
              title: '账户余额',
              dataIndex: 'balanceAmount',
              key: 'balanceAmount',
            }, {
              title: '创建时间',
              dataIndex: 'createdAt',
              key: 'createdAt'
            },{
              title: '完成时间',
              dataIndex: 'updatedAt',
              key: 'updatedAt'
            },{
              title:'操作',
              key: 'action',
              fixed: 'right',
              width:100,
              render: (record) =>{
                if(record.status == -1){
                  return <a onClick={this.fundsConfirm.bind(this,record.changeId)} href='javascript:void 0;'>手工确认</a>
                }
                return ""
                
              }
            }
        ];

        return columns
    }

    
}

FundsRecord.contextTypes= { router: React.PropTypes.object.isRequired};

